let tomcatImg = document.querySelector('.tomcat-img')
let cymbalBtn = document.querySelector('.cymbal-btn')
let timer
// 3. 点猫时，切换图片
tomcatImg.onclick = function(){
   changeImg('angry', 25)
}
// 4. 点击敲锣按钮时，开定时器切换图片
cymbalBtn.onclick = function(){
    changeImg('cymbal', 12)
}

function changeImg(path, endIdx){
    clearInterval(timer)
    let idx = 0
    timer = setInterval(function(){
        tomcatImg.src = `imgs/Animations/${path}/${path}_${getIdx(idx)}.jpg`
        idx++
        if(idx > endIdx) {
            clearInterval(timer)
        }
    }, 70)
}

// 自动拼0
function getIdx(i){
    // 小于10，拼接0后再返回
    // 其他情况，原样返回
    if(i < 10) {
        return '0' + i
    } else {
        return i
    }
  
}